.banner {
	background-image: url('../../image/banner.png');
	background-repeat: no-repeat;
	background-position: center;
	width: 100%;
	// max-width: 1920px;
	.banner-title {
		position: relative;
		left: -30px;
		padding-top: 158px;
		width: 650px;
		font-size: 60px;
		font-weight: bold;
		color: #ffffff;
	}
	.btn-join {
		display: inline-block;
		padding: 10px 22px;
		font-size: 32px;
		font-weight: bold;
		color: #ffffff;
		background: #ff8023;
		border-radius: 100px;
		cursor: pointer;
	}
	.banner-card {
		width: 312px;
		height: 128px;
		background: #f9f9f9;
		border-radius: 10px;
	}
}

.btn-try {
	display: inline-block;
	background: linear-gradient(180deg, #fab700 0%, #ff8023 100%);
	border-radius: 100px;
	color: #fff;
	cursor: pointer;
}

.bg-yellow {
	background-color: #fab700;
}

.bg-green {
	background-color: #03c4bc;
}

.bg-blue {
	background-color: #25b1fb;
}

.w280 {
	width: 280px;
}

.h182 {
	height: 182px;
}

.w138 {
	width: 138px;
}

.h138 {
	height: 138px;
}

.w416 {
	width: 416px;
}

.w605 {
	width: 605px;
}

.w398 {
	width: 398px;
}

.h128 {
	height: 128px;
}

.w168 {
	width: 168px;
}

.tab-trigger-item {
	color: #c2c4db;
	background: #f8f8f8;
	border-radius: 10px;
	transition: all 0.3s;
	cursor: pointer;
}

.tab-trigger-item-active {
	border-radius: 10px;
	transition: all 0.3s;
	cursor: pointer;
	background: #f5232d;
	color: #ffffff;
}

.tab-content-item {
	animation: indexTabIn 0.3s;
}

@keyframes indexTabIn {
	from {
		transform: translateX(30px);
	}

	to {
		transform: translateX(0);
	}
}
